{% load comments %}
{% load text_filters %}
{% load battle %}
{% load posts %}
<div class="battle-comments-list">
    <div class="battle-comment-prefix battle-comment-prefix-side-{{ comment.metadata.battle.side }}">
        за «{{ comment.battle_side }}»
    </div>
    <div class="block comment {% if comment.created_at > post_last_view_at %}comment-is-new{% endif %} comment-type-battle comment-type-battle-side-{{ comment.metadata.battle.side }}" id="comment-{{ comment.id }}">
        <div class="comment-header">
            <div class="comment-title">{{ comment.title | rutypography }}</div>
            <div  class="comment-type-battle-userinfo">
                {% include "users/widgets/tiny.html" with user=comment.author show_name=True %}

                <a href="#comment-{{ comment.id }}" class="reply-date">
                    {{ comment.created_at | cool_date }}
                </a>
            </div>
        </div>
        <div class="comment-rating">
            <comment-upvote :initial-upvotes="{{ comment.upvotes }}"
                             :hours-to-retract-vote="{{settings.RETRACT_VOTE_IN_HOURS}}"
                             upvote-url="{% url "upvote_comment" comment.id %}"
                             retract-vote-url="{% url "retract_comment_vote" comment.id %}"
                             {% if comment.is_voted %}
                                initial-is-voted
                                initial-upvote-timestamp="{{comment.upvoted_at}}"
                             {% endif %}
                             {% if not me|can_upvote_comment:comment or upvote_disabled %}is-disabled{% endif %}>
            </comment-upvote>

            {% if comment.is_pinned %}
                <div class="comment-pinned-icon"><i class="fas fa-thumbtack"></i></div>
            {% endif %}
        </div>
        <div class="comment-body thread-collapse-toggle">
            <div class="text-body text-body-type-comment">
                {% render_comment comment %}
            </div>
        </div>
        <div class="comment-footer thread-collapse-toggle">
            {% if me.id == comment.author_id or me.id == comment.post.author_id or me.is_moderator %}
                {% if comment.is_deleted %}
                    <a href="{% url "delete_comment" comment.id %}" class="comment-footer-button comment-button-visible-on-hover" onclick="return confirm('Восстанавливаем?')"><i class="fas fa-trash-restore"></i></a>
                {% else %}
                    <a href="{% url "delete_comment" comment.id %}" class="comment-footer-button comment-button-visible-on-hover" onclick="return confirm('Удаляем?')"><i class="fas fa-trash"></i></a>
                {% endif %}
            {% endif %}

            {% if me.id == comment.author_id or me.is_moderator %}
                <a href="{% url "edit_comment" comment.id %}" class="comment-footer-button comment-button-visible-on-hover"><i class="fas fa-edit"></i></a>
            {% endif %}

            {% if me and me.is_active_membership and comment.post.is_commentable %}
                <span class="comment-footer-button" v-on:click="showReplyForm('{{ comment.id }}', '')"><i class="fas fa-reply"></i>&nbsp;ответить</span>
            {% endif %}
        </div>
    </div>

    <div class="comment-replies thread-collapse-toggle">
        {% if replies %}
            <div class="replies replies-type-battle replies-indent-normal">
                {% for reply_tree in replies %}
                    {% include "comments/types/reply.html" with comment=reply_tree.comment reply_to=reply_tree.comment replies=reply_tree.replies %}
                {% endfor %}
            </div>
        {% endif %}
    </div>
</div>
